<ion-header>
    <ion-navbar>
        <ion-segment [(ngModel)]="choose" (ionChange)="segmentChanged($event)" >
            <ion-segment-button value="day">
                日榜
            </ion-segment-button>
            <ion-segment-button value="week">
                周榜
            </ion-segment-button>
            <ion-segment-button value="month">
                月榜
            </ion-segment-button>
        </ion-segment>
    </ion-navbar>
</ion-header>

<ion-content>
    <!-- <ion-refresher (ionRefresh)="doRefresh($event)">
        <ion-refresher-content
            pullingIcon= "arrow-round-down"
            :pullingText= "上次刷新：{{ time }}"
            refreshingSpinner= "circles"
            refreshingText= "数据刷新中...">
        </ion-refresher-content>
    </ion-refresher> -->

    <div class="head">
        <ion-grid>
            <ion-row>
                <!-- 2 -->
                <ion-col col-4 float-left text-center>
                    <div class="avatar a2">
                        <img 
                            width="50" 
                            src= "{{ two.headurl }}" 
                            alt=""
                            onerror="onerror=null;src='./assets/icon/logo.png'" >
                        <p>{{ two.nickname }}</p>
                        <span>获胜 <i>{{ two.ordernum }}</i> 单</span>
                    </div>
                </ion-col>
                <!-- 1 -->
                <ion-col col-4 float-left text-center>
                    <div class="avatar a1">
                        <img 
                            width="60" 
                            src="{{ one.headurl }}" 
                            alt=""
                            onerror="onerror=null;src='./assets/icon/logo.png'" >
                        <p>{{ one.nickname }}</p>
                        <span>获胜 <i>{{ one.ordernum }}</i> 单</span>
                    </div>
                </ion-col>
                <!-- 3 -->
                <ion-col col-4 float-left text-center>
                    <div class="avatar a3">
                        <img 
                            width="50" 
                            src="{{ three.headurl }}" 
                            alt=""
                            onerror="onerror=null;src='./assets/icon/logo.png'">
                        <p>{{ three.nickname }}</p>
                        <span>获胜 <i>{{ three.ordernum }}</i> 单</span>
                    </div>
                </ion-col>
            </ion-row>
        </ion-grid>
    </div>
    <ion-list>
        <ion-item *ngFor="let item of Arr; let i=index;" >
            <span item-start>{{ (i+4) < 10 ? "0"+(i+4) : (i+4) }}</span>
            <img 
                width="30" 
                float-left 
                class="pic" 
                src="{{ item.headurl }}" 
                alt=""
                onerror="onerror=null;src='./assets/icon/logo.png'">
            <span>{{ item.nickname }}</span>
            <span item-end>已获胜 <i>{{ item.ordernum }}</i> 单</span>
        </ion-item>
    </ion-list>
</ion-content>
